<!DOCTYPE HTML>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<title>APP</title>
		<link rel="stylesheet" type="text/css" href="../css/aui.css" />
	</head>
	<style>
		.aui-img-object1 {
			/*width: 100px;*/
			/*height: 60px;*/
			/*height: 50px;*/
			margin-right: 5px;
			/*border: 1px solid #16A085;*/
			max-width: 100px;
			max-height: 60px;
			margin: 0 auto;
			width: expression(document.body.clientWidth > 100?"100px":"auto" );
			height: expression(document.body.clientHeight > 60?"60px":"auto" );
		}

		.mysec {
			margin-right: 5px;
			width: 100px;
			height: 60px;
			border: solid 1px #ccc;
			background-color: #eee;
			background: url(../image/sig.png);/*图片地址*/
			background-origin: content;/*从content区域开始显示背景*/
			background-position: 50% 50%;/*图片上下左右居中*/
			background-size: contain;/*保持图像本身的宽高比例，将图片缩放到宽度或高度正好适应定义背景的区域*/
			background-repeat: no-repeat;/*图像不重复显示*/
		}
		.hide {
			display: none;
		}

		.moban {
			margin-left: 5px;
			background: #0062CC;
			color: #fff;
		}

		button, .aui-btn {
			padding: 4px 6px;
			margin-bottom: 0;
			font-size: 16px;
		}
	</style>
	<body>
	<div class="aui-content">   
	    <ul class="aui-user-view hide" id="list0">
	     <script id="template0" type="text/x-dot-template">
					{{for(var i=0;i<it.length;i++){}}
					 <li class="aui-user-view-cell aui-img" >
					 <div>
					 	<img class="aui-img-object1 aui-pull-left icache0" src="../image/sig.png" urls="{{=it[i].imgfile}}">
					 </div>					 
               		 <div class="aui-img-body">
                    	<span>{{=it[i].username}}<input class="aui-pull-right aui-checkbox aui-radio-info" type="checkbox" name="demo"></span>
                   	 	<p class='aui-ellipsis-1'>{{=it[i].time}}</p>                    
               		 </div> 
               		 </li>  
					{{}}}
			</script>
	    </ul>
	    <ul class="aui-user-view " id="list1"></ul>
	    <ul class="aui-user-view hide" id="list2"></ul>
	    <script id="template1" type="text/x-dot-template">
					{{for(var i=0;i<it.length;i++){}}
					 <li class="aui-user-view-cell aui-img">
					 <div class="aui-col-xs-4 mysec icache1" urls="{{=it[i].imgfile}}">
					 	<!--<img class="aui-img-object1 aui-pull-left icache1" src="../image/sig.png" urls="{{=it[i].filename1}}">-->
					 </div>						 
					<!-- <div class="aui-col-xs-4 aui-text-center">
					 	<img class="aui-img-object1 aui-pull-left icache1" src="../image/sig.png" urls="{{=it[i].filename1}}">
					 </div>-->	
               		 <div class="aui-img-body">
                    	<span>{{=it[i].username}}<input class="aui-pull-right aui-checkbox aui-radio-info" type="checkbox" name="demo"></span>
                   	 	<p class='aui-ellipsis-1'>{{=it[i].time}}</p>                    
               		 </div> 
               		 </li>  
					{{}}}
		</script>
		                   
        <script id="template2" type="text/x-dot-template">
					{{for(var i=0;i<it.length;i++){}}
					 <li class="aui-user-view-cell aui-img" id="{{=it[i].id}}">
					  <div class="aui-col-xs-4 mysec icache2" urls="{{=it[i].imgfile}}">	
					  			 	
					  </div>	
					 <!--<div class="aui-col-xs-4 aui-text-center">
					 	<img class="aui-img-object1 aui-pull-left icache2" src="../image/sig.png" urls="{{=it[i].filename1}}">
					 </div>-->
               		 <div class="aui-col-xs-7">
                    	<span>{{=it[i].username}}
                    	<p class="aui-pull-right"><button class="aui-btn aui-btn-info" >模</button>                    	
                    	</p>                    	                   	
                    	</span>
                   	 	<p class='aui-ellipsis-1'>{{=it[i].time}}</p>                    
               		 </div> 
               		 
               		 <div class="aui-col-xs-1">
               		 	<input class="aui-checkbox aui-radio-info" type="checkbox" name="demo"> 
               		 </div>
               		 
               		 
               		 </li>  
					{{}}}
			</script>
    </div>
	</body>
	<script type="text/javascript" src="../script/doT.min.js" ></script>
	<script type="text/javascript" src="../script/api.js" ></script>
	<script type="text/javascript" src="../script/zepto.js" ></script>
	<script type="text/javascript" src="../script/APICloud-rest-SHA1.js"></script>	
	<!--<script type="text/javascript" src="../script/debug.js"></script>-->
	<script type="text/javascript">
	
		var APPID = "A6996268375072";
		var APPKEY = "DF2513D5-2329-E8B0-7064-A9D8D701D282";
				 
		var filelist=[];
		var data=[];
		var filename="胡华成_T_20151114222416.jpg";
		var bBusy=false;
		var bSelect=[true,true,true];	
		var selectCount=[0,0,0];			
		
		var uid = null;
		var bSave = false;
		var imgname = null;
		var txtname = null;
		
		var kind = 1;//0-基本，1-签名，2-模板
		var Dirs = [".","data", "template"];
		var Types=[".txt","jpg"];
		var models=["SignData","SignData","SignTemplate"];//模型数据
		
		var datalist=[[],[],[]];
		
		var tpllist=[];

		function FilterFile(s){		
			var pos1=s.indexOf("_");
			var pos2=s.indexOf(".jpg");
			if(pos1>0&&pos2>0)
			{	
				var t=s.substring(pos1+3,pos2);
				t=t.substring(0,4)+"/"+t.substring(4,6)+"/"+t.substring(6,8)+" "+t.substring(8,10)+":"+t.substring(10,12)+":"+t.substring(12,14);
				return {username:s.substring(0,pos1),imgfile:s,datafile:s.substring(0,pos2)+".txt",time:t}; 			
			}
			else
				return null; 		
		}
				
		var bdel=false;
		function DelItem(item,callback){
			if(bdel)
				return;
			bdel=true;
			var bdel1=true;
			var bdel2=true;			
			var fs=api.require('fs');					
			fs.remove({
		        path: 'fs://'+item.imgfile,
	        },function(ret,err){
	        	bdel1=false;
	        	bdel=bdel1&&bdel2;
	        });
	        fs.remove({
		        path: 'fs://'+item.datafile,
	        },function(ret,err){
	        	bdel2=false;
	        	bdel=bdel1&&bdel2;
	        	callback();
	        });		
		}
		
		function ShowData(k){
			var data=[];
			for(var i=0;i<filelist[k].length;i++)
			{
				if(!filelist[k][i].hasOwnProperty("del"))				
					data.push(filelist[k][i]);				
			}
			if(data.length>0)
			{			
				var template = document.getElementById('template'+k);
				var list_content = document.getElementById('list'+k);
				var pagefn = doT.template(template.text);
				list_content.innerHTML = pagefn(data);					
				cache('.icache'+k,k);
			}		
		}			
		
		function AppendData(k,data){
			if(data&&data.length>0){
				var template = document.getElementById('template'+k);
				var list_content = document.getElementById('list'+k);
				var pagefn = doT.template(template.text);				
				list_content.appendChild(pagefn(data));
				cache('.icache1',k);			
			}		
		}
				
		function FindCloud(){		
			//alert("云端同步");
			var kk=2;
			var client = new Resource(APPID, APPKEY);
			var model = client.Factory(models[kk]);
			uid=$api.getStorage('uid');
			model.query(
				{
					"filter": {
				    "where": {"userid":uid},
				    "skip": 0,
				    "limit": 20
				  	}		
				},
				function(ret,err){
				var data=ret;								
				if(ret&&ret.length>0)
				{						
					api.writeFile({
					    path: 'fs://template.json',
					    data: JSON.stringify(data)
					}, function(ret, err){
					    var status = ret.status;
					    if(status){
					        api.alert({msg:'数据同步成功!'});
					    } else{
					        api.alert({msg:"模板签名数据同步失败!"});					        
					    }
					});						
					
//					function downfile(){
//					var obj=listAll[i];
//						if(obj.checked)
//					{					
//						var el=$api.closest(obj, '.aui-user-view-cell');					
//						var item=filelist[kind][i];					
//						var fs=api.require('fs');
//				        fs.remove({
//					        path: 'fs://'+Dirs[kind]+"/"+item.datafile,
//				        	},function(ret,err){	
//				        	//log(ret,err,item);		        				        	
//				        	fs.remove({
//						        path: 'fs://'+Dirs[kind]+"/"+item.imgfile,
//					       		},function(ret,err){				       						       		
//					       		$api.remove(el);				       		
//					       		//for(var j=i;j<filelist[kind].length-1;j++)
//					       		filelist[kind][i].del=true;
//					       		i+=1;
//					       		if(i<count)
//					       			delitem();
//					       		else
//					       		{
//						       		fs=null;
//						       		item=null;
//						       		el=null;
//					       		}			       			
//				        	});				        	
//				        });
//					}
//					else
//					{
//						//console.log('ti='+i);
//						i+=1;
//						if(i<count)
//							delitem();	
//						else
//					    {
//								fs=null;
//						        item=null;
//						        el=null;
//					     }		
//					}				
//				};		
//					
					
					
//					for(var i=0;i<data.data.length;i++)
//					{
//						var item=data.data[i];
//						var bExist=false;										
//						for(var j=0;j<filelist[2].length;j++)							
//							if(item.imgfile.indexOf(filelist[2][j].imgfile)>=0)
//							{
//								bExist=true;break;
//							}																		
//						if(bExist)
//						{
//							
//						}
//						else
//						{
//							var url=item.imgfile;
//							api.download({
//							    url: url,
//							    savePath: 'fs://template/'+item.imgfile.name,
//							    report: true,
//							    cache: true,
//							    allowResume:true
//							},function(ret,err){
//							    if (ret) {
//							        var value = ('文件大小：'+ret.fileSize+'；下载进度：'+ret.percent+'；下载状态'+ret.state+'存储路径: '+ret.savePath);
//							    } else{
//							        var value = err.msg;
//							    }
//							});							
//						}
//					}							
				}						
			});
		}
				
		function FindList(k,callback) {
			api.showProgress({
			    style: 'default',
			    animationType: 'fade',
			    title: '努力加载中...',
			    text: '先喝杯茶...',
			    modal: true
			});					
			var fs = api.require('fs');
			fs.readDir({
				path : 'fs://'+Dirs[k]
			}, function(ret, err) {
				var status = ret.status;
				if (status) {
					var data = ret.data;
					//console.log(JSON.stringify(data));		
					if (data) {
						filelist[k]=[];
						for(var i in data){
							var o=	FilterFile(data[i]);
							if(o)
							{
								filelist[k].push(o);		
							}												
						}
						api.hideProgress();
						console.log(JSON.stringify(filelist));					
						callback(k);
					} else {
						api.alert({
							msg : '此目录下为空'
						});
						api.hideProgress();
					}
				} else {
					api.hideProgress();
				}
			});
		}		
		//循环递归调用方式
		function Del(){
			var id="#list"+kind;
			var listAll=$api.domAll(id+' .aui-checkbox');			
			var count=listAll.length;
			var i=0;			
			delitem();						
			function delitem(){
				var obj=listAll[i];
				if(obj.checked)
				{					
					var el=$api.closest(obj, '.aui-user-view-cell');					
					var item=filelist[kind][i];					
					var fs=api.require('fs');
			        fs.remove({
				        path: 'fs://'+Dirs[kind]+"/"+item.datafile,
			        	},function(ret,err){	
			        	//log(ret,err,item);		        				        	
			        	fs.remove({
					        path: 'fs://'+Dirs[kind]+"/"+item.imgfile,
				       		},function(ret,err){				       						       		
				       		$api.remove(el);				       		
				       		//for(var j=i;j<filelist[kind].length-1;j++)
				       		filelist[kind][i].del=true;
				       		i+=1;
				       		if(i<count)
				       			delitem();
				       		else
				       		{
					       		fs=null;
					       		item=null;
					       		el=null;
				       		}			       			
			        	});				        	
			        });
				}
				else
				{					
					i+=1;
					if(i<count) delitem();
				}				
			};						
		}
		
		function ChangeShow(k){
			if(kind==k)
				return;			
			var alllist=$api.domAll('.aui-user-view');			
			$api.addCls(alllist[kind],'hide');
			kind=k;
			$api.removeCls(alllist[kind],'hide');
		}
		
		apiready = function() {
		
			filelist[0]=[];
			filelist[1]=[];
			filelist[2]=[];
			
			//ChangeShow(0);
			FindList(1,ShowData);	
			FindList(2,ShowData);
			ChangeShow(1);	//缺省为用户签名	
			//刷新文件事件
			api.addEventListener({
	            name:'SignList_Change'
            },function(ret,err){
            	if(ret&&ret.value)
            		ChangeShow(ret.value);
            });            
					
			//删除文件事件
			api.addEventListener({
	            name:'SignList_DelFile'
            },function(ret,err){
            	Del();
            });            
            
            //全选事件
			api.addEventListener({
	            name:'SignList_SelectAll'
            },function(ret,err){
            	var id="#list"+kind;
            	console.log(kind);
				var listAll=$api.domAll(id+' .aui-checkbox');
				for(var i=listAll.length-1;i>=0;i--)
				{
					if(listAll[i])
						listAll[i].checked=bSelect[kind];
				}
				bSelect[kind]=!bSelect[kind];				
            });
            
            //刷新文件事件
			api.addEventListener({
	            name:'SignList_Refresh'
            },function(ret,err){
            	kind=2;
            	FindList(kind,ShowData);
            });           
                        
            //文件排序事件
			api.addEventListener({
	            name:'SignList_Sort'
            },function(ret,err){
            	//FindList(ShowData);
            });
                        
            //搜索文件事件
			api.addEventListener({
	            name:'SignList_Search'
            },function(ret,err){
            	FindList(ShowData);
            });
            
            //云端同步事件
			api.addEventListener({
	            name:'SignList_Cloud'
            },function(ret,err){
            	FindCloud();
            });
                        
            api.readFile({
		                path:"fs://template.json"
	                },function(ret,err){
	                	if(ret)
	                	{
	                		tpllist=JSON.parse(ret.data);
	                		alert(JSON.stringify(tpllist));
	                	}	                	
	            });                     
		}
	
	function cache(selector,k){
		//console.log(selector);
		var imgs=$api.domAll(selector);	
		//console.log(imgs.length);		
		for(var i=0;i<imgs.length;i++)
		{	
			(function(){
				var el=imgs[i];
				var url = $api.attr(el, 'urls');
				var path ='fs://'+Dirs[k]+"/"+ url;
				
				api.readFile({
		                path:path
	                },function(ret,err){
	                	//log(k,i,url,ret,err);
	                	url='url('+ret.data+')';	                	
	                	var css="background-image:"+url;                	
	                	$api.css(el,css);	                	
	            });
            })(i);
		}	
	}
			
	function iCache(selector,k) {
		selector.each(function(data) {
			//alert(JSON.stringify(data));
			! function(data) {
				var url = selector.eq(data).attr("urls");
				//url=filelist[filelist.length-1];
				var filename = url;//.filename1;//GetFileName(url);
				//log(Dirs,kind);
				var path ='fs://'+Dirs[k]+"/"+ filename;
				//console.log(path);
				api.readFile({
	                path:path
                },function(ret,err){
                	//coding...
                	url='url('+ret.data+')';                	
                	selector.eq(data).css("background-image",url);//backgroud模式                	
                	//selector.eq(data).attr('src', ret.data);//img模式
                });
			}(data);
		});
	};
	</script>
</html>